<template>
  <div style="background-color: #ffffff;">
    <!-- :before-change="beforeChange" -->
    <HeadNav
      :title="currentDate +'申报明细'"
      :leftArrow="true"></HeadNav>
    <div class="content">
      <div class="contentTop">
        <div class="contentTop-left">
          <img
            src="../../assets/images/dangkou.png"
            alt=""
            style="width: 34px; height: 34px;">
        </div>
        <div class="contentTop-right">
          <div class="contentTop-right-top">运中食堂第一档口</div>
          <div class="contentTop-right-bottom">2025-01-26 提交清单</div>
        </div>
      </div>
      <div class="contentBottom">
        <div
          class="detailItem"
          v-for="(item, index) in detailsBox.detailList"
          :key="index">
          <div class="name">{{ item.name }}</div>
          <div class="bottom">
            <div class="price"> ￥{{ item.price }}</div>
            <div class="num">{{ item.num }} 件</div>
            <div class="allPrice">￥{{ item.allPrice }} </div>
          </div>
        </div>
      </div>
      <div class="sumBox">
        <div class="sumNum">共{{ detailsBox.sumNum }}项</div>
        <div class="text">合计</div>
        <div class="sumPrice">￥{{ detailsBox.sumPrice }}</div>
      </div>
    </div>
    <!-- <foot></foot> -->
  </div>
</template>

<script>
/* eslint-disable */
import { getApplyCertificationPagePho, getVerifyTypeList } from '@/api/api'
import { getParams } from '@/common/public'
import HeadNav from '@/components/HeadNav'
import foot from '../foot/foot.vue'
import moment from 'moment'
import { mapState } from 'vuex'
export default {
    name: 'ApplyDetails',
    components: {
        HeadNav,
        foot
    },
    computed: {},
    watch: {
        active(newVal) {
            console.log('newVal', newVal)
            if (newVal === 0) {
                this.params.applyType = null
                this.loading = true
                this.contentData = []
                this.finished = false
                if (!this.finished) {
                    this.onLoad(1)
                }
            } else {
                this.params.applyType = newVal
                this.loading = true
                this.contentData = []
                this.finished = false
                if (!this.finished) {
                    this.onLoad(1)
                }
            }
        }
    },
    data() {
        return {
            navBarTitle: '申报明细',
            params: {
                id: '',
                date: ''
            },
            detailsBox: {
                detailList: [
                    {
                        id: 1,
                        name: '新东大鸡排  (件/20公斤)',
                        price: '170',
                        num: 2,
                        allPrice: '340'
                    },
                    {
                        id: 1,
                        name: '鱼丸\虾丸（件/10公斤）',
                        price: '115.00',
                        num: 1,
                        allPrice: '115'
                    },
                    {
                        id: 1,
                        name: '奥尔良腌料（袋/2斤）',
                        price: '80',
                        num: 2,
                        allPrice: '160'
                    },
                    {
                        id: 1,
                        name: '螺蛳粉专用辣椒（袋/50斤）',
                        price: '30',
                        num: 3,
                        allPrice: '90'
                    },
                    {
                        id: 1,
                        name: '鸡油（袋/2斤）',
                        price: '18',
                        num: 5,
                        allPrice: '90'
                    }
                ],
                sumPrice: '795',
                sumNum: '5'
            },
            currentDate


        }
    },
    beforeRouteEnter(to, from, next) {
        next((vm) => {
            if(to.query.item!==undefined){
                vm.localData = JSON.parse(to.query.item)
                console.log(vm.params.id, vm.params.date, 'ppppppppppuiuuuuu')
                vm.params.date = vm.localData.date
                console.log(vm.params.date)
                //   this.navBarTitle= vm.params.date + '申报明细'
            }
        })
    },
    mounted() {
        // window.onPageFinished = this.onPageFinished
        // this.$bridge.registerhandler('onPageFinished')
        // Android端
        // window.android.showToast('展示内容提示')
        // window['onPageFinished'] = (data) => {

        // const u = navigator.userAgent
        // const isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 // g
        // const isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) // ios终端
        // if (isAndroid) {
        //     window.android.hideToolbar()
        //     window.android.setEnableSwipeBack(true)
        // }
        // if (isIOS) {
        //     var s = {}
        //     // this.$bridge.callhandler('hideToolbar', s, (data) => { })
        // }
        // }

        // 当天日期
        const timestamp = new Date().getTime();
        const date = new Date(timestamp);
        const year = date.getFullYear();
        const month = String(date.getMonth() + 1).padStart(2, '0');
        const day = String(date.getDate()).padStart(2, '0');
        this.currentDate = `${year}-${month}-${day}`;
        console.log(this.currentDate,'this.currentDate');
    },
    created() {
        // // 保存token
        // // localStorage.setItem('Authorization', '')
        // const Authorization = getParams('access_token')
        // this.$store.commit('applyrecords/setToken', Authorization)
        // // this.$store.state.area.areaSelect
        // console.log(
        //     'this.$store.state.applyrecords.token',
        //     this.$store.state.applyrecords.token
        // )
        // console.log(Authorization)
        // console.log(location.href)
        // localStorage.setItem('Authorization', Authorization)
        // if (!sessionStorage.getItem('Authorization')) {
        //     sessionStorage.setItem('Authorization', Authorization)
        // }

        // // console.log(sessionStorage.getItem('Authorization'))
        // // // 认证任务
        // // // this.getApplyRecordPho()
        // // // 获取认证类型
        // // this.paramsStatus.access_token = sessionStorage.getItem('Authorization')
        // // getVerifyTypeList(this.paramsStatus).then((res) => {
        // //     if (res.statusCode === 0) {
        // //         console.log('获取认证类型', res)
        // //         const list = res.content.map((item, index) => {
        // //             return {
        // //                 typeId: item.typeId,
        // //                 typeName: item.typeName
        // //             }
        // //         })
        // //         console.log('list', list)
        // //         if (list.length > 0) {
        // //             this.tabDatasss = this.tabDatasss.concat(list)
        // //             this.tabData = this.tabDatasss
        // //             console.log('tabData1', this.tabData)
        // //         }
        // //         // this.tabData = this.tabData.concat(list)
        // //         console.log('tabData2', this.tabData)
        // //     } else {
        // //         // this.$message.error(res.errorMessage)
        // //     }
        // // })
    },
    methods: {

        toCheck() {
            this.$router.push({ path: '/selectFillIn' })
        }


    },
    beforeDestroy() {
        console.log('index')
        window.removeEventListener('scroll', this.onLoad, true)
    }
}
</script>

<style lang="less" scoped>
span,
p {
    padding: 0;
    margin: 0;
}

/deep/.van-tab {
    z-index: 200;
    height: 44px;
    //  background:rgb(216, 143, 143);
}

/deep/.van-tabs__wrap .van-tabs__wrap--scrollable {
    position: fixed;
}

/deep/.van-tab--active {
    /* color: rgb(255, 152, 82); */
}

/deep/.van-tabs__line {
    height: 0.6vw;
    background-color: rgb(255, 152, 82);
}

.content {
    overflow: hidden;
    margin-bottom: 10px;
}

.contentTop {
    background-color: white;
    padding: 25px 24px;
    margin-top: 42px;
    display: flex;
    align-items: center;

    .contentTop-left {
        width: 54px;
        height: 54px;
        border-radius: 54px;
        background: #f9f9f9;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .contentTop-right {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        margin-left: 16px;
    }

    .contentTop-right-top {
        font-size: 18px;
        text-align: left;
        color: #000000;
        line-height: 18px;
    }

    .contentTop-right-bottom {
        font-size: 16px;
        line-height: 16px;
        text-align: left;
        color: #000000;
        margin-top: 12px;
    }
}

.contentMiddle {
    background-color: #f9f9f9;
    height: 15px;
}

.contentBottom {
    background-color: #f9f9f9;
    padding-top: 15px;
    padding-bottom: 15px;

    .detailItem {
        background-color: #ffffff;
        padding: 12px 24px;
        margin-bottom: 5px;

        .name {
            font-size: 16px;
            color: #000000;
        }

        .bottom {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-top: 18px;

            .price,
            .num {
                color: #999999;
                font-size: 15px;
            }

            .allPrice {
                font-size: 15px;
                color: #000000;
            }
        }
    }
    .detailItem:last-child{
        margin-bottom: 0px;
    }


}
.sumBox{
    display: flex;
    align-items: center;
    margin-top: 20px;
    padding-left: 24px;
    padding-bottom: 40px;

    .sumNum{
        font-size: 12px;
        color: #999999;
    }
    .text{
        color: #047DCB;
        font-size: 12px;
    }
    .sumPrice{
        font-size: 18px;
        color: #000000;
        margin-left: 8px;
        margin-right: 8px;
    }
}


/*清浮动*/
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}

.clearfix {
    zoom: 1;
}

.fl {
    // width: 180px;
    color: #666666;
    float: left;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}

.fr {
    float: right;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: rgb(153, 153, 153, 0.5);
    font-size: 13px;
}

/deep/.van-tabs__wrap {
    touch-action: manipulation;
    border-top: none;
}

/deep/.van-tab {
    border-top: none;
    border-bottom: 1px solid rgba(245, 244, 249, 1);
}

.emptyContainer {
    // background: red;
    height: 50px;

    /deep/.van-list__finished-text {
        height: 400px;
        background: palegreen;
    }
}

// 去逛逛
.loginBtn {
    width: 100%;
    height: 45px;
    border: none;
    background: #047DCB;
    border-radius: 45px;
}

.tips {
    margin-top: 25px;
    font-size: 14px;
    text-align: right;
    color: #000000;
    line-height: 14px;
}
</style>